<template>
  <div>
    <div class="box" @click="btn11(MessageList.id)">
      <div class="line">
        <div class="line-cen">
          <div style="position: relative">
            <img
              :src="MessageList.type == 1 ? imgS2 : imgS1"
              width="50"
              alt=""
            />
            <div class="hongdian" v-show="MessageList.isReader">
              <img src="../../assets/images/红点.png" width="10" alt="" />
            </div>
          </div>
          <div>
            <p>
              {{ MessageList.type == 1 ? "系统消息" : "个人消息" }}
              <img :src="MessageList.top == 1 ? imgS3 : ''" width="12" alt="" />
            </p>
            <span>发布人:{{ MessageList.sourceName }}</span>
          </div>
        </div>
        <div style="color: #999">
          {{ MessageList.createTime }}
          <img
            style="margin-left: 10px"
            src="../../assets/images/More.png"
            width="7"
            alt=""
          />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ["MessageList", "text"],
  data() {
    return {
      imgS1: require("../../assets/images/个人信息.png"),
      imgS2: require("../../assets/images/系统消息.png"),
      imgS3: require("../../assets/images/置顶.png")
    };
  },
  methods: {
    btn11(id) {
      this.$router.push("/messageID/" + id);
    },
  },
};
</script>
 
<style lang = "less" scoped>
* {
  padding: 0;

  margin: 0;
}
.hongdian {
  position: absolute;
  top: 0;
  right: 0;
}
.box {
  margin-top: 15px;
  background: #fff;
  .line {
    padding: 15px;
    display: flex;
    border-bottom: 1px solid #999;
    height: 65px;
    align-items: center;
    justify-content: space-between;
    .line-cen {
      align-items: center;
      display: flex;

      div {
        padding-left: 15px;
        span {
          color: #999;
        }
      }
    }
  }
}
</style>